<!doctype html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link href="../css/mui.min.css" rel="stylesheet" />
		<link rel="stylesheet" href="../css/style.css" />
		<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=wqBXfIN3HkpM1AHKWujjCdsi"></script>
	    <style>
	    	#container{position: absolute;top: -4.5rem;left: 0px;bottom: 0px;right: 0px;}
	    </style>
	</head>

	<body>
		<header class="mui-bar mui-bar-nav ding-bar">
		    <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
		    <h1 class="mui-title">考勤打卡</h1>
		</header>
		<div class="mui-content">		   
		   <div id="container"></div>
		   <div class="daka-container">
		   	   <div style="position: relative">
			   	   	<span id="riqi">7月3日</span>
			   	   	<span id="week">星期三</span>
			   	   	<div style="width: 1px;height: 1.5rem;position: absolute;top: 1rem;left: 1.25rem;background: #b0acac;"></div>
		   	   </div>
		   	   <div class="daka-xqing">
		   	   	   <p><span class="wai"><span class="nei"></span></span><span class="daka-type" id="sw-zt">上班打卡:未打卡</span></p>
		   	   	   <p style="margin-top: 0.8rem;"><span class="wai"><span class="nei"></span></span><span class="daka-type" id="xw-zt">下班打卡:未打卡</span></p>
		   	   </div>
		   	   <div class="daka-btn">
		   	   	   <span id="type">下班打卡</span>
		   	   	   <span id="daka-time">18：24</span>
		   	   </div>
		   	   <p style="text-align: center;">点击打卡</p>
		   </div>
		</div>
		<script src="../js/mui.min.js"></script>
		<script type="text/javascript" src="../js/jquery-1.8.0.min.js" ></script>
		<script type="text/javascript" src="../js/head_public.js" ></script>
		<script type="text/javascript" src="../js/session.js" ></script>
		<script type="text/javascript" src="../js/common.js" ></script>
		<script type="text/javascript" src="../js/juli.js" ></script>
		<script>
			$(function(){
			//获取当前时间
         var $date=new Date();
         var $month= $date.getMonth()+1;
         var $day=$date.getDate();
         var $week=$date.getDay();
         var hourse=$date.getHours();
         var min=$date.getMinutes();
         if(hourse<12){
         	$("#type").html("上班打卡");
         }else{
         	$("#type").html("下班打卡");
         }
         $("#daka-time").html(hourse+":"+min)
         $("#riqi").html($month+"月"+$day+"日");
		         switch ($week){
		         	case 0:
		         	    $("#week").html("星期日")
		         		break;
		         	case 1:
		         	    $("#week").html("星期一")
		         		break;
		         	case 2:
		         	    $("#week").html("星期二")
		         		break;
		         	case 3:
		         	    $("week").html("星期三")
		         		break;
		         	case 4:
		         	    $("#week").html("星期四")
		         		break;
		         	case 5:
		         	    $("#week").html("星期五")
		         		break;
		         	case 6:
		         	    $("#week").html("星期六")
		         		break;
		         	default:
		         		break;
		         }
			})

			mui.init()
			var map = new BMap.Map("container");
			var point = new BMap.Point(104.331398,39.897445);
		    map.centerAndZoom(point,12);
		    var lat="";//纬度
		    var lng="";//经度
			var geolocation = new BMap.Geolocation();
			geolocation.getCurrentPosition(function(r){
				if(this.getStatus() == BMAP_STATUS_SUCCESS){
//					var mk = new BMap.Marker(r.point);
//					map.addOverlay(mk);
					map.panTo(r.point);
					lat=r.point.lat;
					lng=r.point.lng;
					function addMarker(point, index){  // 创建图标对象   
				    var myIcon = new BMap.Icon("../images/ditu-biao.png", new BMap.Size(30, 30), {    
				        // 指定定位位置。   
				        // 当标注显示在地图上时，其所指向的地理位置距离图标左上    
				        // 角各偏移10像素和25像素。您可以看到在本例中该位置即是   
				        // 图标中央下端的尖角位置。    
//				        anchor: new BMap.Size(10, 25),    
				        // 设置图片偏移。   
				        // 当您需要从一幅较大的图片中截取某部分作为标注图标时，您   
				        // 需要指定大图的偏移位置，此做法与css sprites技术类似。    
//				        imageOffset: new BMap.Size(0, 0 - index * 25)   // 设置图片偏移    
				    }); 
				    
				    // 创建标注对象并添加到地图   
                    var marker = new BMap.Marker(point, {icon: myIcon});
                    map.addOverlay(marker); 
                   }
					addMarker(r.point)
					var myGeo = new BMap.Geocoder();      
					// 根据坐标得到地址描述    
					myGeo.getLocation(new BMap.Point(r.point.lng, r.point.lat), function(result){      
					    if (result){ 
					    	var marker = new BMap.Marker(point);        // 创建标注    
							map.addOverlay(marker); 
					        var opts = {    
							    width : 250,     // 信息窗口宽度    
							    height: 100,     // 信息窗口高度    
							    title : "当前位置"  // 信息窗口标题   
							}    
							var infoWindow = new BMap.InfoWindow(result.address, opts);  // 创建信息窗口对象   
							map.openInfoWindow(infoWindow, map.getCenter());
					    }      
					});
				}    
			});
//			判断是否登录
            var userid=getCookie("userid")
            var work_id=getCookie("workid")
            var member_work=getCookie("work")
             	if(userid==""||userid==null){
             		alert("您还没有登录，请先登录")
             		location.href="../public/login.html"
//           		
             	}else{
             		var params={};
             		params.member_id=userid;
         			$.post(net+"/public/index.php?s=api/elevator/sign_index	",params,function(res){
         				if(res.code=="200"){
         					if(res.result.mess!=null||res.result.mess.length!=0){
         						$.each(res.result.mess, function(index,val) {
         							if(this.type=="1"){
         								if(this.addtime!=""){
         									$("#sw-zt").html("上班打卡:"+timestampTohourse(this.addtime))
         									
         								}else{
         									$("#sw-zt").html("上班打卡:未打卡")
         								}
         							}else if(this.type=="2"){

         								if(this.addtime!=""){
         									var time=timestampTohourse(this.addtime);
         									$("#xw-zt").html("下班打卡:"+time)
         								}else{
         									$("#xw-zt").html("下班打卡:未打卡")
         								}
         							}
         						});
         					}
         					mui(".daka-container").on("tap",".daka-btn",function(){
	         				    var date_now=new Date();
	         				    var h=date_now.getHours();
	         				    var type="";
	//	         				     判断在上午还是下午
	         				    if(h<12){
	         				    	type="1";
	         				    	
	         				    }else{
	         				    	type="2";
	         				    }
	         					var cankao_lng=res.result.longitude;
	         					var cankao_lat=res.result.latitude;
	//	         				var cankao_point=new BMap.Point(cankao_lng,cankao_lat);
	//	         				var shiji_point=new BMap.Point(lng,lat);
	//	         				var distance= map.getDistance(cankao_point,shiji_point);
	                            //计算距离
	                            var distance=BMapLib.GeoUtils.getDistance(cankao_lng,cankao_lat,lng,lat)
//	                            console.log(distance)
	         					distance=Math.round(distance*100)/100;  
	         					if(distance>200){
	         						alert("您不在公司范围内，不能打卡");
	         						return false;
	         					}
	         					var daka_param={};
	         					daka_param.member_id=userid;
	         					daka_param.work_id=work_id;
	         					daka_param.member_work=member_work;
	         					daka_param.el_longitude=lng;
	         					daka_param.el_latitude=lat;
	         					daka_param.type=type;
	         					//添加打卡记录
	         					$.post(net+"/public/index.php?s=api/elevator/add_sign",daka_param,function(res){
	         						if(res.code=="200"){
	         						   alert("打卡成功")	
	         						   location.reload();
	         						}
	         					})
         					})
         				}
         			})
             		
         			
             	}
		</script>
	</body>

</html>